<script>
export default {
  name: "pageA",
  methods:{
    toB(){
      // this.$router.push('/pageB')
      //函数式传参 1.path query
      // this.$router.push({
      //   path:'/pageB',
      //   query:{
      //     id:103,type:'free'
      //   }
      // })
      // 2.name和params
      // this.$router.push({
      //   name:'pageB',
      //   params:{
      //     sex:'1',
      //     num:1
      //   }
      // })
      //删除页面栈
      // this.$router.replace('/pageB');
      // this.$router.go(1);//正数：前进,0:刷新，负数:后退
      // this.$router.back();//回退一个页面栈
      // this.$router.forward();//前进一个页面栈

    }
  }
}
</script>

<template>
<div>
  pageA
<!--  声明式-->
<!--  1.path和query传参-->
<!--  <router-link to="/pageB?id=103">跳转到页面B</router-link>-->
<!--  <router-link :to="{path:'/pageB',query:{id:103,type:'free'}}">path和query传参跳转到页面B</router-link>-->
  <br>
<!--  2.name和params-->
  <router-link :to="{name:'pageB',params:{sex:'1',num:1}}">name和params声明式传参跳转到页面B</router-link>
  <br>
<!--  函数式-->
  <button @click="toB">函数式传参跳转到B</button>
</div>
</template>

<style scoped lang="less">

</style>